<!DOCTYPE html>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=GB18030">
        <title>Insert title here</title>
		<style type="text/css">
			input[type=button] {
				width: 200px;
			}
		</style>
    </head>
    <body>
    	<center>
	    	<input type="button" value="中国红" style="background:#FF0000;" id="red">
	    	<input type="button" value="绿野仙踪" style="background:#00FF00;" id="green">
	    	<input type="button" value="蓝色妖姬" style="background:#0000FF;" id="blue">
		</center>

        <script>
             var bodyEle = document.body;

            //  var inputEle = document.getElementsByTagName('input');
             var inputEle = document.querySelectorAll('input');
             inputEle.forEach(function(item){
                item.onclick = function(){
                    bodyEle.style.backgroundColor = item.style.backgroundColor;
                }
             })

             
        </script>
    </body>
</html>
